9 / 18

Sequence-style diagramURL copied

direction: right
flow: {
  shape: sequence_diagram
  client: {
    shape: person
    icon: "https://api.iconify.design/material-symbols:person.svg"
  }
  api: {
    shape: rectangle
    icon: "https://api.iconify.design/mdi:api.svg"
  }
  auth: {
    shape: rectangle
    icon: "https://api.iconify.design/mdi:shield-lock.svg"
  }

  client -> api: POST /login
  api -> auth: verify credentials
  auth -> api: jwt
  api -> client: 200 + token
}
Auth Handshake
Copied
```d2
---
title: Auth Handshake
width: 90vw
height: 420px
---
direction: right
flow: {
  shape: sequence_diagram
  client: {
    shape: person
    icon: "https://api.iconify.design/material-symbols:person.svg"
  }
  api: {
    shape: rectangle
    icon: "https://api.iconify.design/mdi:api.svg"
  }
  auth: {
    shape: rectangle
    icon: "https://api.iconify.design/mdi:shield-lock.svg"
  }

  client -> api: POST /login
  api -> auth: verify credentials
  auth -> api: jwt
  api -> client: 200 + token
}
```